/**
 * Created by asus on 2016/11/23.
 */
import React, { Component,PropTypes} from 'react';
import {Link} from 'react-router';
import TabBar from '../../Component/CommonComponent/TabBar'
import AllOrderList from '../../Component/CommonComponent/AllOrderList'
import Split from '../CommonComponent/Split'
import Top from '../CommonComponent/Top'
import Empty from '../CommonComponent/Empty'
import Time from '../CommonComponent/Time'
import StockDesc from '../../Component/StockManage/StockDesc';
import IsShowEmptyImg from '../CommonComponent/IsShowEmptyImg'
import {bodyScroll} from '../../Action/rpc';
import {ReturnListDetail,ReturnOrderDelivery} from '../../Action/auth'
import $ from 'jquery'
import iScroll from "iscroll/build/iscroll-probe";

export default class TestGoodsDesc extends Component {
    // 构造
    constructor(props) {
        super(props);
        // 初始状态
        this.state = {
            returnDetailArray:[],
            changeDetailArray:[]
        };
    }

    static contextTypes = {
        router:PropTypes.object
    }

    async componentWillMount() {
        this.getTestListDesc(this.props.location.query.orderNo)
    }


    componentWillUnmount() {
        document.querySelector('body').removeEventListener('touchmove',bodyScroll, false);
    }

    async getTestListDesc(orderNo){
        await ReturnListDetail(orderNo)
            .then(res=>{
                this.setState({returnDetailArray:res.returnDetail});
                this.setState({changeDetailArray:res.changeDetail});
            })
    }

    async agreeTest(status){
        await ReturnOrderDelivery(this.props.location.query.orderNo,status)
            .then(res=>{
                alert('审批成功')
                this.context.router.push({pathname:'/PersonalCenter'})
            })
    }


    render(){
        const {returnDetailArray,changeDetailArray}=this.state;
        return(
            <div className="f14">
                <Top
                    title ={'退换货审批详情'}
                />
                <div className="pl10 colorlv" style={{marginTop:50,height:40,lineHeight:'40px'}}>退货订单详情</div>
                <div className="bkg_color">
                            {
                                returnDetailArray.length==0?
                                    <div className="f14 tc" style={{marginTop:20}}>暂无数据哦~</div>
                                    :
                                returnDetailArray&&returnDetailArray.map((el,index)=>{
                                    return(
                                        <div className="padd10 flex flex-pack-justify f14" style={{borderTop:'1px solid #e5e5e5'}}>
                                            <div><img src={el.productImage} style={{width:50,height:50}} alt=""/></div>
                                            <div className=" flex-v" style={{marginLeft:20}}>
                                                <div>产品名称：<span>{el.productName}</span></div>
                                                <div>价格：<span>{parseFloat(el.price/100).toFixed(2)}</span></div>
                                                <div>退货数量：<span>{el.num}</span></div>
                                            </div>
                                        </div>
                                    )
                                })
                            }

                </div>
                <div className="pl10 colorlv border_top border_bottom" style={{height:40,lineHeight:'40px'}}>换货订单详情</div>
                <div className="bkg_color">
                    {
                        changeDetailArray.length==0?
                            <div className="f14 tc" style={{marginTop:20}}>暂无数据哦~</div>
                            :
                        changeDetailArray&&changeDetailArray.map((el,index)=>{
                            return(
                                <div className="padd10 flex flex-pack-justify f14" style={{borderBottom:'1px solid #e5e5e5'}}>
                                    <div><img src={el.productImage} style={{width:50,height:50}} alt=""/></div>
                                    <div className=" flex-v" style={{marginLeft:20}}>
                                        <div>产品名称：<span>{el.productName}</span></div>
                                        <div>价格：<span>{parseFloat(el.price/100).toFixed(2)}</span></div>
                                        <div>换货数量：<span>{el.num}</span></div>
                                    </div>
                                </div>
                            )
                        })
                    }
                </div>
                {
                    this.props.location.query.index != 1 ?
                        <div>
                            <div className="tr fr colorlv changeBorder border_4 di"
                                 style={{height:25,lineHeight:'25px',padding:'0 5px',margin:'10px 20px'}}
                                 onClick = {()=>this.agreeTest(1)}
                            >
                                同意
                            </div>
                            <div className="tr fr colorlv changeBorder border_4 di"
                                 style={{height:25,lineHeight:'25px',padding:'0 5px',margin:'10px 0'}}
                                 onClick = {()=>this.agreeTest(2)}
                            >
                                拒绝
                            </div>
                        </div>
                        :null
                }
                {
                    this.props.location.query.index == 1 ?
                        <div className="tr fr color9 border_gray border_4 di bor999"
                             style={{height:25,lineHeight:'25px',padding:'0 5px',margin:'10px 20px'}}
                        >
                            {this.props.location.query.status == 0?'未审批':this.props.location.query.status == 1 ?'已同意':'已拒绝'}
                        </div>
                        :null
                }

            </div>
        )
    }

}

